<template>
  <div id="layout" >
    <template v-if="$store.state.isInit">
      <van-nav-bar
          class="app-nav-bar"
          left-text="返回"
          right-text="刷新"
          @click-left="routerBack"
          @click-right="refresh"
          left-arrow
      >
        <template #title>
          <!--        <van-dropdown-menu active-color="#FF3C28" class="store-dropdown">-->
          <!--          <van-dropdown-item-->
          <!--            v-model="$store.state.options.storeList.value"-->
          <!--            :options="$store.state.options.storeList.options" >-->
          <!--          </van-dropdown-item>-->
          <!--        </van-dropdown-menu>-->
        </template>

      </van-nav-bar>

      <div style="height: 40px;" />

      <router-view />

      <div style="height: 40px" />

      <van-tabbar v-if="$store.state.menu.active !== 'login'" class="app-bottom"
                  v-model="$store.state.menu.active" active-color="#FF3C28" inactive-color="#000">
        <van-tabbar-item v-for="i in $store.state.menu.map" :to="i['to']" :name="i['name']" :icon="i['icon']"
                         :badge="$store.state.menu.badge[i['name']] || ''">
          {{ i.title }}
        </van-tabbar-item>
      </van-tabbar>

    </template>

    <loading />
  </div>
</template>

<script>
import Loading from "@/components/Loading";
export default {
  name: "index",
  components: {
    Loading
  },
  data() {
    return {

    }
  },
  methods: {
    routerBack() {
      this.$router.back();
    },
    refresh() {
      location.reload();
    }
  },
  mounted() {
    this.$store.dispatch('initApp', {router: this.$router, route: this.$route});
  }
}
</script>
